<template>
  <el-form :model="form" :disabled='isDisabled' ref="ruleForm" label-width="110px">
    <el-row style="width:100%">
      <el-col :span="8">
        <el-form-item label="所属车间" prop='workshopId'>
          <el-select
            v-model="form.workshopId"
            placeholder="请选择车间"
            size="small"
            clearable
            @change="handleWorkshop"
          >
            <el-option
              v-for="item in workshopList"
              :key="item.workshopId"
              :label="item.workshopName"
              :value="item.workshopId"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="所属产线" prop='erpProductionLineCode'>
          <el-select
            v-model="form.lineId"
            placeholder="请选择产线"
            size="small"
            clearable
            @change="handleLine"
          >
            <el-option
              v-for="item in lineList"
              :key="item.lineId"
              :label="item.lineName"
              :value="item.lineId"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="所属工位" prop='stationId'>
          <el-select
            v-model="form.stationId"
            placeholder="请选择所属工位"
            size="small"
            clearable
            :disabled="stationDisabled"
            @change="handleStation"
          >
            <el-option
              v-for="item in stationList"
              :key="item.workStationId"
              :label="item.workStationName"
              :value="item.workStationId"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="6">
        <el-form-item label="班组">
          <div>{{form.groupName}}</div>
        </el-form-item>
      </el-col>

      <el-col :span="5">
        <el-form-item label="班次">
          <div>{{form.classesName}}</div>
        </el-form-item>
      </el-col>

      <el-col :span="5">
        <el-form-item label="填写人">
          <div>{{form.reportName}}</div>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item label="工作时间">
          <div>{{form.startTime}}-{{form.endTime}}</div>
        </el-form-item>
      </el-col>
    </el-row>

    <el-form-item label="工艺参数调整" prop='processParamAdjust'>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2}"
        maxlength="1000"
        show-word-limit
        placeholder="请输入工艺参数调整"
        v-model="form.processParamAdjust">
      </el-input>
    </el-form-item>

    <el-form-item label="设备运行情况" prop='equipmentOperationDes'>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2}"
        maxlength="1000"
        show-word-limit
        placeholder="请输入设备运行情况"
        v-model="form.equipmentOperationDes">
      </el-input>
    </el-form-item>

    <el-form-item label="卫生清洁工作" prop='hygieneCleanDes'>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2}"
        maxlength="1000"
        show-word-limit
        placeholder="请输入卫生清洁工作"
        v-model="form.hygieneCleanDes">
      </el-input>
    </el-form-item>

    <el-form-item label="安全" prop='secureDes'>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2}"
        maxlength="1000"
        show-word-limit
        placeholder="请输入"
        v-model="form.secureDes">
      </el-input>
    </el-form-item>

    <el-form-item label="质量" prop='qualityDes'>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2}"
        maxlength="1000"
        show-word-limit
        placeholder="请输入"
        v-model="form.qualityDes">
      </el-input>
    </el-form-item>

    <el-form-item label="备注" prop='notes'>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2}"
        maxlength="1000"
        show-word-limit
        placeholder="请输入备注"
        v-model="form.notes">
      </el-input>
    </el-form-item>
  </el-form>
</template>
<script>
  import {getProducingGroupByLineId,getLogByUser,getHistoryLog } from "@/api/workbench/index";
  import { mapState,mapGetters,mapActions } from "vuex";
export default {
  props: {
    row: {
      type: Object,
      default: ()=>{}
    },
    isDisabled:{
      type: Boolean,
      default: false
    },
    mode:{
      type: String,
      default: "report"
    }
  },
  data() {
    return {
      workshopList:[],
      lineList:[],
      stationList:[],
      stationDisabled:false,
      saveloading:false,
      baseType:"init",
      form: {
        dateTime:null,
        factoryDeptId:null,
        factoryDeptCode:null,
        workshopId:null,
        lineId:null,
        stationId:null,
        groupId:null,
        preLogId:null,
        processParamAdjust:null,
        equipmentOperationDes:null,
        hygieneCleanDes:null,
        notes:null,
        secureDes:null,
        qualityDes:null
      }
    };
  },
  computed: {
    // form: {
    //   set(val) {

    //   },
    //   get() {
    //     return this.row
    //   }
    // },
    ...mapGetters([
      'permitList',
      'realname'
    ]),
  },

  methods: {
    getData(){
      if(this.form.factoryDeptId){
        this.handleFactory(this.form.factoryDeptId,"init")
      }
      if(this.form.workshopId){
        this.handleWorkshop(this.form.workshopId,"init")
      }
      if(this.form.lineId){
        this.handleLine(this.form.lineId,"init")
      }
      if(this.form.stationId){
        this.handleStation(this.form.stationId,"init")
      }
    },

    //获取交接班数据
    getProductionLog() {
      if(!this.form.lineId){
        return
      }
      this.saveloading = true;
      const param = {
        lineId:this.form?.lineId
      };
      getProducingGroupByLineId(param)
      .then((res) => {
        if(res.code == 200){
          const {groupName,classesName,startTime,endTime} = res.data
          this.form.groupName = groupName;
          this.form.classesName = classesName;
          this.form.startTime = startTime;
          this.form.endTime = endTime;
          this.form.reportName = this.realname;
          this.form.preLogId = res.data?.id;
          this.form.groupId = res.data?.groupId;
          this.stationDisabled = false;
          if(this.mode == "report" && this.form.preLogId){
            this.handleStation(this.form.stationId)
          }
          this.saveloading = false;
        }else{
          this.form.groupName = null;
          this.form.classesName = null;
          this.form.startTime = null;
          this.form.endTime = null;
          this.form.reportName = null;
          this.form.preLogId = null;
          this.form.groupId = null;
          this.stationDisabled = true;
          this.saveloading = false;
        }
      })
      .catch(() => {
        this.form.groupName = null;
        this.form.classesName = null;
        this.form.startTime = null;
        this.form.endTime = null;
        this.form.reportName = null;
        this.form.preLogId = null;
        this.form.groupId = null;
        this.stationDisabled = true;
        this.saveloading = false;
      });
    },

    //选择工厂,获取车间数据
    handleFactory(val,type){
      this.baseType = type;
      if(!type){
        this.form.workshopId = null;
        this.form.lineId = null;
        this.form.stationId = null;
      }
      const factoryItem = this.permitList.find(ele => ele.factoryDeptId === val);
      this.workshopList = factoryItem?.workshopVos ? factoryItem?.workshopVos : [];
    },

    //选择车间,获取产线数据
    handleWorkshop(val,type){
      this.baseType = type;
      const workshopItem = this.workshopList.find(ele => ele.workshopId === val);
      this.lineList = workshopItem?.productionLineVos ? workshopItem?.productionLineVos : [];
      if(!type){
        this.form.lineId = null;
        this.form.stationId = null;
        this.form.groupName = null;
        this.form.classesName = null;
        this.form.startTime = null;
        this.form.endTime = null;
        this.form.reportName = null;
        this.form.preLogId = null;
        this.form.groupId = null;
        this.form.processParamAdjust = null;
        this.form.equipmentOperationDes = null;
        this.form.hygieneCleanDes = null;
        this.form.notes = null;
        this.form.secureDes = null;
        this.form.qualityDes = null;
        this.stationDisabled = true;
        this.$emit("update",workshopItem,'workshop',type)
      }
    },

    handleLine(val,type){
      this.baseType = type;
      const lineItem = this.lineList.find(ele => ele.lineId === val);
      this.stationList = lineItem?.workStationVos || [];
      if(!type){
        this.form.stationId = null;
        this.form.groupName = null;
        this.form.classesName = null;
        this.form.startTime = null;
        this.form.endTime = null;
        this.form.reportName = null;
        this.form.preLogId = null;
        this.form.groupId = null;
        this.form.processParamAdjust = null;
        this.form.equipmentOperationDes = null;
        this.form.hygieneCleanDes = null;
        this.form.notes = null;
        this.form.secureDes = null;
        this.form.qualityDes = null;
        this.stationDisabled = true;
        this.$emit("update",lineItem,'line',type)
      }
      if(this.mode == "report"){
        this.getProductionLog()
      }
    },

    handleStation(val,type){
      this.baseType = type;
      const stationItem = this.stationList.find(ele => ele.workStationId === val);
      if(!type){
        this.form.processParamAdjust = null;
        this.form.equipmentOperationDes = null;
        this.form.hygieneCleanDes = null;
        this.form.notes = null;
        this.form.secureDes = null;
        this.form.qualityDes = null;
        this.$emit("update",stationItem,'station');
        if(this.mode == "report" && this.form.preLogId){
          this.getRecentlyLogByUser()
        }
      }
    },

    //获取最近一次提交的日志
    getRecentlyLogByUser() {
      if(!this.form.stationId){
        return
      }
      const {preLogId,factoryDeptId,factoryDeptCode,dateTime,workshopId,lineId,stationId,groupId} = this.form
      const parmas = {
        preLogId,
        factoryDeptId,
        factoryDeptCode,
        dateTime,
        workshopId,
        lineId,
        stationId,
        groupId
      }
      this.form.hygieneCleanDes = null;
      this.form.notes = null;
      this.form.processParamAdjust = null;
      this.form.equipmentOperationDes = null;
      this.form.secureDes = null;
      this.form.qualityDes = null;
      getLogByUser(parmas).then(res => {
        if (res.code == 200) {
          if(res?.data){
            const {hygieneCleanDes,equipmentOperationDes,notes,processParamAdjust,secureDes,qualityDes} = res.data;
            this.form.hygieneCleanDes = hygieneCleanDes;
            this.form.notes = notes;
            this.form.processParamAdjust = processParamAdjust;
            this.form.equipmentOperationDes = equipmentOperationDes;
            this.form.secureDes = secureDes;
            this.form.qualityDes = qualityDes;
            this.$forceUpdate();
          }
        } else {
          this.msgError(res.msg || "操作失败")
        }
      }).catch(() => {
        this.msgError("操作失败")
      })
    }
  },

  watch:{
    row:{
      handler(newVal){
        if(newVal){
          this.form = Object.assign({},newVal);
        }
        if(this.baseType == "init"){
          this.getData()
        }
      },
      deep: true,
      immediate: true
    }
  }
};

</script>
<style lang="scss" scoped>
.el-form {
  // display: flex;
  // justify-content: space-between;
  // flex-flow: wrap;
  .el-form-item{
    margin-bottom:0.8rem;
    .el-date-editor.el-input,
    .el-select {
      width: 100%;
    }
  }
}
</style>
